<template>
	<view class="container">
		<view class="topImg" @click="gotoDetail">
			<image :src="imgUrl" mode="aspectFill"></image>
			<view class="view1">
				<view class="lab1">校服订购<image src="../../static/market_school_title_arrow.png" mode="widthFix"></image></view>
				<view class="lab2">SCHOOL UNIFOFM</view>
			</view>
			<view class="view2">校园服饰系统服务商--哈芙琳</view>
		</view>
		<view class="list1" @click="gotoPurInfo">
			<image src="../../static/icon_host_pure_gmxz.png" mode=""></image>
			<view class="listT">
				<view class="lab3">{{i18n.item1Name}}</view>
				<view class="lab4 ellipsis--1">{{i18n.item1Value}}</view>
			</view>
		</view>
		<view class="list1 listR" @click="gotoKefu">
			<image src="../../static/icon_host_pure_kfzc.png" mode="widthFix"></image>
			<view class="listT">
				<view class="lab3">{{i18n.item2Name}}</view>
				<view class="lab4">{{i18n.item2Value}}</view>
			</view>
		</view>
		<view class="login" v-if="isAppLogin == false">
		
		   <view class="rightBtn">{{i18n.loginValue}}</view>
		   <view class="to-pay-btn" @tap="btnGoTologin">{{i18n.login}}</view>
		</view>
		<uni-popup ref="popupAddCart" type="center">
			<view class="popupAddCartCon">
				<view class="title">通知</view>
				<view class="titleDetail">
					<text>如果出现微信开发者工具启动后白屏的问题，检查是否启动多个微信开发者工具，如果是则关闭所有打开的微信开发者工具</text>
				</view>
				<view class="popbtn" @click="btncloseclick">
					知道了
				</view>
			</view>
		</uni-popup>
	</view>
	
</template>

<script>
	const globalData = getApp().globalData
	
	import {throttle} from '../../util/util.js'
	// import uniIcons from '../../components/uni-icons/uni-icons.vue'
	import {homepage} from '../../api/index.js'
	export default {
		data() {
			return {
				totalPrice:0,
				orderNum:0,
				imgUrl:'',
				isAppLogin:true,
				appSchoolId:'',
				connectionBool:true
				
			}
		},
		computed: {
		  i18n() {
		    return globalData.$t('index')
		  }
		},
	    onLoad() {
			
			const value = uni.getStorageSync('firstOpen');
			if (value) {
				
			} else{
				
				uni.setStorage({
					key:'firstOpen',
					data:true
				})
				uni.navigateTo({
					url:'./guidePage/guidePage'
				})
			}
			
			// console.log('info',)
			this.addrLists();
			
			// this.urlTobase64();
			

	    },
		onShow() {
			
			
			this.isAppLogin = getApp().globalData.AppLogin
			this.appSchoolId = getApp().globalData.appSchoolId
			
			
		},
		onPullDownRefresh() {
			
			this.addrLists();
		},
		methods: {
		  async addrLists(){
		  	try{
				let {result} = await homepage({schoolId:this.appSchoolId});
				this.imgUrl = result.picUrl?result.picUrl:'../../static/school.jpg';
				uni.stopPullDownRefresh();
			} catch(err){
				this.imgUrl = '../../static/school.jpg';
				uni.stopPullDownRefresh();
			}
		  	
		  },
          btnGoTologin(){
			  uni.navigateTo({
			  	url:'../loginOne/loginOne'
			  })
		  },
		  gotoDetail(){
			  
			  if (getApp().globalData.needAddChild) {
				  
				uni.setStorage({
					key:'fromType',
					data:'index'
					
				})
				  
			  	uni.navigateTo({
			  		url:'../loginTwo/loginTwo'
			  	})
			  } else{
				  
				  // if (getApp().globalData.AppLogin) {
				  	uni.navigateTo({
				  		url:'../companyDe/companyDe'
				  	})
				  // } else{
				  // 	uni.navigateTo({
				  // 		url:'../loginOne/loginOne'
				  // 	})
				  // }
			  	
			  }
			  
			  
		  },
		  urlTobase64(){
			
			  console.log('开始转换')
			  
			  
			  uni.request({
			  url: 'http://hdoss.ufile.ucloud.com.cn/banjo/picture/988.pdf',
			  method: 'GET',
			  // header:{
				 //  'Content-Type':'text/html;charset:utf-8',
			  // },
			  responseType: 'text',
			  success: async res => {
				  
				 console.log(';;;;',res);
			  // let base64 = wx.arrayBufferToBase64(res.data); //把arraybuffer转成base64
			  // toBase64Url = 'data:image/jpeg;base64,' + base64; //不加上这串字符，在页面无法显示
			  // console.log(toBase64Url);
			  }
			  });
			  
		  },
		  gotoPurInfo(){
			  uni.navigateTo({
			  	url:'../purchaseInfo/purchaseInfo'
			  })
		  },
		  gotoKefu(){
			  
			  if (getApp().globalData.AppLogin) {
				  uni.navigateTo({
				  	url:'../privateChat/privateChat'
				  })
			  }else{
				  uni.navigateTo({
				  	url:'../loginOne/loginOne'
				  })
			  }
			  
			  
			  
			  // this.$refs.popupAddCart.open();
			  // console.log('测试多次点击',this.appSchoolId);
			  
			  // console.log('测试多次点击',globalData.$t('index'));
		  },
		  gotoKefu1(){
			  console.log('测试多次点击');
		  },
		  btncloseclick(){
			  this.$refs.popupAddCart.close();
		  }
		  
		},
		// comments: {
		// 	uniIcons
		// }
	}
</script>

<style lang="less" scoped>
	page{
		height: 100%;
	}
	.container {
		background-color: #f6f6f6;
		height: 100%;
		position: relative;
	}
	
	.popupAddCartCon{
		// margin:0 40rpx;
		background-color: #FFFFFF;
		padding-bottom:60rpx;
		border-radius: 20rpx;
		width: 600rpx;
		.title{
			background-color: #F5F5F5;
			height: 100rpx;
			font-size: 45rpx;
			font-size: 400;
			line-height: 100rpx;
			text-align: center;
		
		}
			
		.titleDetail{
			padding: 20rpx 30rpx 80rpx;
			font-size: 30rpx;
			color: #888;
			font-weight: 300;
		}
		.popbtn{
		   color: #fff;
		   background-color: #FF1493;
		   height: 90rpx;
		   line-height: 90rpx;
		   border-radius: 50rpx;
		   width: 400rpx;
		   margin: 0 auto;
		   font-size: 32rpx;
		   text-align: center;
					   
		}
	}
	
	
	.login{
		position: fixed;
		
		bottom: 20px;  
		bottom: calc(20px + constant(safe-area-inset-bottom));  
		bottom: calc(20px + env(safe-area-inset-bottom));
		left: 30rpx;
		width: 640rpx;
		height: 70rpx;
		background-color: rgba(0,0,0,0.4);
		align-items: center;
		border-radius: 35rpx;
		padding-left: 30rpx;
		padding-right: 20rpx;
		display: flex;
		justify-content: space-between;
		z-index: 3;
		.rightBtn{
			font-size: 24rpx;
			color: #fff;
			
		}
		.to-pay-btn {
			width: 160upx;
			text-align: center;
			height: 50rpx;
			line-height: 50upx;
			border-radius: 25rpx;
			font-size: 28upx;
			color: #ffffff;
			box-shadow: 0px 2px 20px 0px rgba(234, 227, 255, 0.6);
			background: linear-gradient(135deg, #2D64F9 0%, #6323D5 100%)
			// margin-left: 20rpx;
		}
	}
	.topImg{
		margin-left: 30rpx;
		margin-right: 40rpx;
		height: 710rpx;
		position: relative;
		
		image{
			width: 100%;
			height: 100%;
			border-radius: 20rpx;
			// color: rgb(221,13,92);
		}
		.view1{
			position: absolute;
			top: 20rpx;
			left: 20rpx;
			.lab1{
				color: #FFFFFF;
				font-weight: bold;
				display: flex;
				align-items: center;
				font-size: 32rpx;
				image{
					margin-left: 20rpx;
					width: 35rpx;
					height: 35rpx;
				}

			}
			.lab2{
				
				color: #FFFFFF;
				font-weight: 400;
				font-size: 24rpx;
				margin-top: 10rpx;
				
				
			}
			
		}
		.view2{
			position: absolute;
			bottom: 30rpx;
			right: 20rpx;
			color: #FFFFFF;
			font-size: 18rpx;
		}
		
	}

	.list1{
		margin: 20rpx 20rpx 0;
		padding: 34rpx 20rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		background: linear-gradient(135deg, #2D64F9 0%, #6323D5 100%);
		box-shadow: 0px 2px 20px 0px rgba(234, 227, 255, 0.6);
		border-radius: 20rpx;
		
		
		image{
			height: 80rpx;
			width: 80rpx;
		}
		.listT{
			margin-left: 30rpx;
			.lab3{
				color: #FFFFFF;
				font-size: 32rpx;
				font-weight: bold;
				
			}
			.lab4{
				margin-top: 25rpx;
				color: #FFFFFF;
				font-size: 20rpx;
				font-weight: 200;
				width: 530rpx;
			}
		}
		
	}
	.listR{
		background: linear-gradient(135deg, #FDA152 0%, #FF414A 100%);
	}
	.goodItem {
			padding: 0 20upx;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			
		  }
		.goodItem .items{
			width: 345upx;
			margin-bottom: 20upx;
		}
		.goodItem .goodImage {
			width: 100%;
			height: 345upx;
			position: relative;
		}
		
		.goodItem .goodImage image{
			width: 100%;
			height: 100%;
		}
		.styleList{
			display: flex; 
			padding: 23upx 0 22upx;
		}
		.contentGroud{
			padding: 0 16upx;
			background-color:#F9F9F9;
			padding-top: 23upx;
		}
		.contentBsse{
			background-color:#fff;
		}
	 .totle{
			font-size: 26upx;
			font-family: PingFang-SC-Medium, PingFang-SC;
			font-weight: 400;
			color: #333333;
			text-align: left;
		}
		.goodItem .contentGroud .justify{
			display: flex;
			justify-content: space-between;
			margin-top: 18upx;
			
		}
		.itemMoney{
			
			font-size: 32upx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #C24E4E;
		}
		.itemMoney text{
			font-size: 20rpx;
		}
		.itemSales{
			
			font-size: 24upx;
			font-family: PingFang-SC-Medium, PingFang-SC;
			font-weight: 300;
			color: #C24E4E;
			width: 100rpx;
			height: 46rpx;
			line-height: 46rpx;
			border-radius: 23rpx;
			border: 1rpx solid #C24E4E;
			text-align: center;
		}
	
		.jiesuan-box {
			display: flex;
			justify-content: space-between;
			width: 710rpx;
			height: 100upx;
			border-radius: 50rpx;
			position: fixed;
			/*#ifdef H5 */
			bottom: 100upx;
			/*#endif*/
			/*#ifdef APP-PLUS */
			bottom: 0upx;
			/*#endif*/
		
			/*#ifdef MP-WEIXIN */
			bottom: 0upx;
			/*#endif*/
			left: 20rpx;
			border-top: 1px solid #eee;
			background-color: #333333;
		
			.left-price {
				display: flex;
				width: 510upx;
				justify-content: flex-start;
				padding: 0 30upx 0 10rpx;
				font-size: 28upx;
				box-sizing: border-box;
				align-items: center;
		
				.all_select_box {
					width: 80rpx;
					height: 80rpx;
					background: #FFFFFF;
					display: flex;
					align-items: center;
		            justify-content: center;
					border-radius: 50%;
					
				}
		
				.total {
					margin-left: 30rpx;
					display: flex;
					flex-direction: column;
					align-items: flex-start;
					color: #FFFFFF;
					
					text{
						font-size: 20rpx;
					}
		
				}
			}
		
			.to-pay-btn {
				width: 240upx;
				text-align: center;
				line-height: 100upx;
				font-size: 32upx;
				color: #ffffff;
				background-color: #C24E4E;
				border-bottom-right-radius: 50rpx;
				border-top-right-radius: 50rpx;
			}
		}
</style>
